import Link from 'next/link'
import React from 'react'
import SignInButton from './SignInButton'
import { auth } from '@/lib/auth'
import { ThemeToggle } from '@/components/ThemeToggle'

type Props = {}

const Navbar = async (props: Props) => {
  const session = await auth()
  console.log('session', session)
  return (
    <nav className="fixed inset-x-0 top-0 z-10 bg-white dark:bg-gray-950 h-fit border-b border-zinc-300 py-2 ">
      <div className="flex items-center justify-center h-full gap-2 mx-auto sm:justify-between max-w-7xl box-border  ">
        <Link href="/" className="items-center hidden gap-2 sm:flex">
          <p className="rounded-lg border-2 border-b-4 border-r-4 border-black px-2 py-1 text-xl font-bold transition-all hover:-translate-y-[2px] cursor-pointer  md:block dark:border-white ">
            爱学不学
          </p>
        </Link>
        <div className="flex items-center">
          <Link href="/create" className="mr-3">
            创建课程
          </Link>
          <Link href="/create" className="mr-3">
            设置
          </Link>
          <ThemeToggle className="mr-3" />
          <SignInButton />
        </div>
      </div>
    </nav>
  )
}

export default Navbar
